<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>表单</title>
</head>
<body>
<!--form代表整个表单 action代表收集好数据后提交的地址-->
    <form action="#">
<!--表单里面可以写各种表单控件:
    text 普通文本框
    submit 提交
    password 密码输入框
    radio 单选框  checkbox多选
    submit提交 reset重置 button普通按钮
    date日期 color颜色  range进度条  file文件上传
    -->
        姓名：<input type="text" name="uname" placeholder="请输入姓名"><br>
        昵称：<input type="text" name = "nickname1" placeholder="请输入昵称"><br>
<!--     readonly只读，只能看不能改可以提交数据   -->
        昵称：<input type="text" name = "nickname2" placeholder="请输入昵称" readonly value="默认固定值"><br>
<!--      disabled禁用 可以看到值 但是做不了任何操作 数据也无法提交  -->
        昵称：<input type="text" name = "nickname3" placeholder="请输入昵称" disabled ><br>
        密码：<input type="password" name = "upwd" placeholder="请输入密码" value="12345" maxlength="6"><br>
        爱好：<input type="checkbox" name="like" value="0">打游戏
        <input type="checkbox" name="like" value="1">看电影
        <input type="checkbox" name="like" value="2">看书<br>

<!--        单选框：同name不同value,默认选择使用checked-->
        性别：<input type="radio" name="gender" value="1">男
        <input type="radio" name="gender" value="0" checked>女<br>
        生日：<input type="date" name="birthday"><br>
        颜色：<input type="color" name="color"></input><br>
        缩放：<input type = "range" name = "scale"><br>
        文件：<input type="file" name="file"><br>
        <hr>
        喜欢的城市：
        <select name = "city">
            <option value="bj">北京</option>
            <option value="sh">上海</option>
            <option value="cd">成都</option>
            <option value="cq" selected>重庆</option>

        </select><br>
        <input type="checkbox" id="ok">
        <label for="ok">我同意</label>
        <br>
        <label for="uu">关联文字：</label>
        <input  type="text" name="text" id = "uu"></input>
        <hr>
        <br><input type="submit" value="提交" style="">
        <input type="reset" value="重置">
        <input type="button" value="按钮">
        <button>普通按钮</button>
    </form>


</body>
</html>